<template>
    <view class="bodys">
        <view class="justCotain">
            <view class="justCell">
                <view class="">
                    原密码
                </view>
                <view class="justColor">
                    <u--input placeholder="请输入您的原始密码" fontSize="14px" border="none" inputAlign="right"
                        v-model="form.oldPasswd" clearable></u--input>
                </view>
            </view>
            <view class="justCell">
                <view class="">
                    新密码
                </view>
                <view class="justColor">
                    <u--input placeholder="请输入新密码" fontSize="14px" border="none" inputAlign="right"
                        v-model="form.newPasswd" clearable></u--input>
                </view>
            </view>
            <view class="justCell">
                <view class="">
                    确认新密码
                </view>
                <view class="justColor">
                    <u--input placeholder="请再次输入新密码" fontSize="14px" border="none" inputAlign="right"
                        v-model="form.newPasswd1" clearable></u--input>
                </view>
            </view>


        </view>

        <view class="mtop40">
            <u-button text="确定" color="linear-gradient(to right, rgb(80, 121, 237), rgb(80, 121, 237))"
                @click="btnUpdatePasswd()" shape="circle"></u-button>
        </view>
    </view>
</template>

<script>
    import {
        updatePasswd
    } from '@/common/api.js'
    import validate from '@/common/validate.js'
    export default {
        data() {
            return {
                form: {
                    oldPasswd: '',
                    newPasswd: '',
                    newPasswd1: '',
                },
            }
        },
        methods: {
            btnUpdatePasswd() {
                //带有底部bar的跳转
                // uni.reLaunch({
                //     url: '/pages/index/index'
                // })

                // if (!validate.checkPassword(this.form.newPasswd)) {
                //     uni.showToast({
                //         title: '密码需大于8位且包含数字和字母',
                //         icon: 'none'
                //     });
                //     return;
                // }

                if (this.form.newPasswd != this.form.newPasswd1) {
                    this.$u.toast('两次密码不一致')
                    return;
                }

                updatePasswd(this.form).then((res) => {
                    if (res.status === 200 || res.status === 0) {
                        this.$u.toast('修改成功')
                        setTimeout(function() {
                            uni.removeStorageSync('TOKEN_KEY')
                            uni.navigateTo({
                                url: '/pages/login/login'
                            })
                        }, 1000);
                    }
                })
            },
        }
    }
</script>

<style lang="scss" scoped>
    .bodys {
        background-color: #f7f8fa;
        min-height: 100%;
        width: 100%;

        .justCotain {
            border-radius: 12rpx;
            float: left;
            background-color: #fff;
            margin-top: 20rpx;
            width: 100%;
            font-size: 28rpx;

            .justCell {
                width: 94%;
                margin: 0 3%;
                height: 95rpx;
                line-height: 95rpx;
                border-bottom: 1px solid #f8f8f8;
                display: flex;
                justify-content: space-between;

                .justColor {
                    color: #999;
                    display: flex;
                }
            }

            &:active {
                background: #f2f2f2;
            }

            &:last-child {
                border-bottom: none !important;
            }


        }

        .mtop40 {
            width: 90%;
            margin-left: 5%;
            margin-top: 0;
            padding-top: 400rpx;
        }
    }
</style>